const CompressionWebpackPlugin = require('compression-webpack-plugin')
const IS_PROD = ['production', 'prod'].includes(process.env.NODE_ENV)
const productionGzipExtensions = /\.(js|css|json|txt|html|ico|svg)(\?.*)?$/i

module.exports = {
  pages: {
    index: {
      entry: 'src/main.js',
      template: 'public/index.html',
      filename: 'index.html',
      title: `${process.env.VUE_APP_NAME}`
    }
  },
  outputDir: IS_PROD ? `${process.env.VUE_APP_PUBLIC_PATH}` : 'dist',
  publicPath: IS_PROD ? `/${process.env.VUE_APP_PUBLIC_PATH}` : '',
  devServer: {
    hot: true,
    liveReload: true,
    proxy: {
      '/': {
        target: 'http://10.80.18.88:8080/vmock',
        ws: true,
        changeOrigin: true
      }
    }
  },
  configureWebpack: config => {
    const plugins = []
    if (IS_PROD) {
      plugins.push(
        new CompressionWebpackPlugin({
          filename: '[path].gz[query]',
          algorithm: 'gzip',
          test: productionGzipExtensions,
          threshold: 10240,
          minRatio: 0.8
        })
      )
    }
    config.devtool = false
    config.plugins = [...config.plugins, ...plugins]
  },
  css: {
    sourceMap: !IS_PROD,
    extract: IS_PROD,
    loaderOptions: {
      postcss: {
        plugins: [
          require('autoprefixer')({}),
          require('postcss-pxtorem')({
            rootValue: 16,
            unitPrecision: 5,
            propList: ['*']
          })]
      }
    }
  }
}
